<template>
  <view class="my-container">
    <!-- 未登录时，提示登录 -->
    <my-login v-if="!token"></my-login>
    <!-- 登录后显示的盒子 -->
    <my-info v-else :userInfo="userInfo"></my-info>
  </view>
</template>

<script>
  import mix from '@/mixins/tabbar-badge.js'
  import { mapState } from 'vuex'

  export default {
    mixins: [mix],
    data() {
      return {
        redirectInfo: null
      }
    },
    onLoad() {
      // 注册事件监听
      uni.$on('redirect', this.redirectHandler)
    },
    methods: {
      redirectHandler(e) {
        this.redirectInfo = e
        console.log(e)
      }
    },
    onUnload() {
      // 销毁事件监听
      uni.$off('redirect', this.redirectHandler)
    },
    computed: {
      ...mapState(['userInfo', 'token'])
    },
    watch: {
      token(newVal, oldVal) {
        // 判断新旧 token 的值是否不同，并且新 token 的值不能为空
        // 同时，redirectInfo 不能为 null
        if (newVal !== oldVal && newVal !== '' && this.redirectInfo !== null) {
          if (this.redirectInfo.openType === 'switchTab') {
            uni.switchTab({
              url: this.redirectInfo.from,
              complete: () => {
                this.redirectInfo = null
              }
            })
          }
        }
      }
    }
  }
</script>

<style lang="scss">
  page,
  .my-container {
    height: 100%;
  }
</style>
